uni-page,
page {
  --base-color: #FFF;
  --primary-color: #18a058;
  --primary-color-hover: #36ad6a;
  --primary-color-pressed: #0c7a43;
  --primary-color-suppl: #36ad6a;
  --info-color: #2080f0;
  --info-color-hover: #4098fc;
  --info-color-pressed: #1060c9;
  --info-color-suppl: #4098fc;
  --success-color: #18a058;
  --success-color-hover: #36ad6a;
  --success-color-pressed: #0c7a43;
  --success-color-suppl: #36ad6a;
  --warning-color: #f0a020;
  --warning-color-hover: #fcb040;
  --warning-color-pressed: #c97c10;
  --warning-color-suppl: #fcb040;
  --error-color: #d03050;
  --error-color-hover: #de576d;
  --error-color-pressed: #ab1f3f;
  --error-color-suppl: #de576d;
  --text-color-base: #000;
  --text-color-1: rgb(31, 34, 37);
  --text-color-2: rgb(51, 54, 57);
  --text-color-3: rgb(118, 124, 130);
  --text-color-disabled: rgba(194, 194, 194, 1);
  --placeholder-color: rgba(194, 194, 194, 1);
  --placeholder-color-disabled: rgba(209, 209, 209, 1);
  --icon-color: rgba(194, 194, 194, 1);
  --icon-color-hover: rgba(146, 146, 146, 1);
  --icon-color-pressed: rgba(175, 175, 175, 1);
  --icon-color-disabled: rgba(209, 209, 209, 1);
  --opacity-1: 0.82;
  --opacity-2: 0.72;
  --opacity-3: 0.38;
  --opacity-4: 0.24;
  --opacity-5: 0.18;
  --divider-color: rgb(239, 239, 245);
  --border-color: rgb(224, 224, 230);
  --close-icon-color: rgba(102, 102, 102, 1);
  --close-icon-color-hover: rgba(102, 102, 102, 1);
  --close-icon-color-pressed: rgba(102, 102, 102, 1);
  --close-color-hover: rgba(0, 0, 0, .09);
  --close-color-pressed: rgba(0, 0, 0, .13);
  --clear-color: rgba(194, 194, 194, 1);
  --clear-color-hover: rgba(146, 146, 146, 1);
  --clear-color-pressed: rgba(175, 175, 175, 1);
  --scrollbar-color: rgba(0, 0, 0, 0.25);
  --scrollbar-color-hover: rgba(0, 0, 0, 0.4);
  --scrollbar-width: 5px;
  --scrollbar-height: 5px;
  --scrollbar-border-radius: 5px;
  --progress-rail-color: rgba(235, 235, 235, 1);
  --rail-color: rgb(219, 219, 223);
  --popover-color: #fff;
  --table-color: #fff;
  --card-color: #fff;
  --modal-color: #fff;
  --body-color: #fff;
  --tag-color: #eee;
  --avatar-color: rgba(204, 204, 204, 1);
  --inverted-color: rgb(0, 20, 40);
  --input-color: rgba(255, 255, 255, 1);
  --code-color: rgb(244, 244, 248);
  --tab-color: rgb(247, 247, 250);
  --action-color: rgb(250, 250, 252);
  --table-header-color: rgb(250, 250, 252);
  --hover-color: rgb(243, 243, 245);
  --table-color-hover: rgba(0, 0, 100, 0.03);
  --table-color-striped: rgba(0, 0, 100, 0.02);
  --pressed-color: rgb(237, 237, 239);
  --opacity-disabled: 0.5;
  --input-color-disabled: rgb(250, 250, 252);
  --button-color-2: rgba(46, 51, 56, .05);
  --button-color-2-hover: rgba(46, 51, 56, .09);
  --button-color-2-pressed: rgba(46, 51, 56, .13);
  --box-shadow-1: 0 1px 2px -2px rgba(0, 0, 0, .08), 0 3px 6px 0 rgba(0, 0, 0, .06), 0 5px 12px 4px rgba(0, 0, 0, .04);
  --box-shadow-2: 0 3px 6px -4px rgba(0, 0, 0, .12), 0 6px 16px 0 rgba(0, 0, 0, .08), 0 9px 28px 8px rgba(0, 0, 0, .05);
  --box-shadow-3: 0 6px 16px -9px rgba(0, 0, 0, .08), 0 9px 28px 0 rgba(0, 0, 0, .05), 0 12px 48px 16px rgba(0, 0, 0, .03);
  --guodu-drawer-bg-color-mask:rgba(0, 0, 0, 0.4);// 遮罩颜色
  --guodu-drawer-bg-color: #ffffff;
}


@media (prefers-color-scheme: dark) {

  page,
  uni-page {
    --base-color: #000;
    --primary-color: #63e2b7;
    --primary-color-hover: #7fe7c4;
    --primary-color-pressed: #5acea7;
    --primary-color-suppl: rgb(42, 148, 125);
    --info-color: #70c0e8;
    --info-color-hover: #8acbec;
    --info-color-pressed: #66afd3;
    --info-color-suppl: rgb(56, 137, 197);
    --success-color: #63e2b7;
    --success-color-hover: #7fe7c4;
    --success-color-pressed: #5acea7;
    --success-color-suppl: rgb(42, 148, 125);
    --warning-color: #f2c97d;
    --warning-color-hover: #f5d599;
    --warning-color-pressed: #e6c260;
    --warning-color-suppl: rgb(240, 138, 0);
    --error-color: #e88080;
    --error-color-hover: #e98b8b;
    --error-color-pressed: #e57272;
    --error-color-suppl: rgb(208, 58, 82);
    --text-color-base: #fff;
    --text-color-1: rgba(255, 255, 255, 0.9);
    --text-color-2: rgba(255, 255, 255, 0.82);
    --text-color-3: rgba(255, 255, 255, 0.52);
    --text-color-disabled: rgba(255, 255, 255, 0.38);
    --placeholder-color: rgba(255, 255, 255, 0.38);
    --placeholder-color-disabled: rgba(255, 255, 255, 0.28);
    --icon-color: rgba(255, 255, 255, 0.38);
    --icon-color-hover: rgba(255, 255, 255, 0.475);
    --icon-color-pressed: rgba(255, 255, 255, 0.30400000000000005);
    --icon-color-disabled: rgba(255, 255, 255, 0.28);
    --opacity-1: 0.9;
    --opacity-2: 0.82;
    --opacity-3: 0.52;
    --opacity-4: 0.38;
    --opacity-5: 0.28;
    --divider-color: rgba(255, 255, 255, 0.09);
    --border-color: rgba(255, 255, 255, 0.24);
    --close-icon-color: rgba(255, 255, 255, 0.52);
    --close-icon-color-hover: rgba(255, 255, 255, 0.52);
    --close-icon-color-pressed: rgba(255, 255, 255, 0.52);
    --close-color-hover: rgba(255, 255, 255, .12);
    --close-color-pressed: rgba(255, 255, 255, .08);
    --clear-color: rgba(255, 255, 255, 0.38);
    --clear-color-hover: rgba(255, 255, 255, 0.48);
    --clear-color-pressed: rgba(255, 255, 255, 0.3);
    --scrollbar-color: rgba(255, 255, 255, 0.2);
    --scrollbar-color-hover: rgba(255, 255, 255, 0.3);
    --scrollbar-width: 5px;
    --scrollbar-height: 5px;
    --scrollbar-border-radius: 5px;
    --progress-rail-color: rgba(255, 255, 255, 0.12);
    --rail-color: rgba(255, 255, 255, 0.2);
    --popover-color: rgb(72, 72, 78);
    --table-color: rgb(24, 24, 28);
    --card-color: rgb(24, 24, 28);
    --modal-color: rgb(44, 44, 50);
    --body-color: rgb(16, 16, 20);
    --tag-color: rgba(51, 51, 51, 1);
    --avatar-color: rgba(255, 255, 255, 0.18);
    --inverted-color: #000;
    --input-color: rgba(255, 255, 255, 0.1);
    --code-color: rgba(255, 255, 255, 0.12);
    --tab-color: rgba(255, 255, 255, 0.04);
    --action-color: rgba(255, 255, 255, 0.06);
    --table-header-color: rgba(255, 255, 255, 0.06);
    --hover-color: rgba(255, 255, 255, 0.09);
    --table-color-hover: rgba(255, 255, 255, 0.06);
    --table-color-striped: rgba(255, 255, 255, 0.05);
    --pressed-color: rgba(255, 255, 255, 0.05);
    --opacity-disabled: 0.38;
    --input-color-disabled: rgba(255, 255, 255, 0.06);
    --button-color-2: rgba(255, 255, 255, .08);
    --button-color-2-hover: rgba(255, 255, 255, .12);
    --button-color-2-pressed: rgba(255, 255, 255, .08);
    --box-shadow-1: 0 1px 2px -2px rgba(0, 0, 0, .24), 0 3px 6px 0 rgba(0, 0, 0, .18), 0 5px 12px 4px rgba(0, 0, 0, .12);
    --box-shadow-2: 0 3px 6px -4px rgba(0, 0, 0, .24), 0 6px 12px 0 rgba(0, 0, 0, .16), 0 9px 18px 8px rgba(0, 0, 0, .10);
    --box-shadow-3: 0 6px 16px -9px rgba(0, 0, 0, .08), 0 9px 28px 0 rgba(0, 0, 0, .05), 0 12px 48px 16px rgba(0, 0, 0, .03);
    --guodu-drawer-bg-color-mask:rgba(120, 120, 120, 0.4);// 遮罩颜色
    --guodu-drawer-bg-color: #000000;
  }
}